<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>简途旅行</title>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="wap-font-scale" content="no">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" href="/old/css/bonus/withdraw.scss?__inline" media="screen" title="no_title" charset="utf-8">
</head>
<body style="visibility: hidden;">
<div class="page show" id="startup">
    <img src="https://images.simpletour.com/activity/bonus/startupPage.png" alt=""/>
</div>
<div class="page" id="fetch">
    <div class="page-content">
        <div class="header">
            <img src="https://images.simpletour.com/activity/bonus/header_bg@3x.png" alt=""/>
        </div>
        <div class="content">
            <!--领取红包-->
            <!--<div class="red_packet">-->
                <!--<img src="https://images.simpletour.com/activity/bonus/packet_opened@3x.png" alt=""/>-->
                <!--<a class="receive">立即领取</a>-->
            <!--</div>-->
            <!--倒计时-->
            <div class="countdown">
                <img src="https://images.simpletour.com/activity/bonus/countdown_bg@3x.png" alt=""/>
                <div class="time-group">
                    <div class="t-title">下一波红包倒计时</div>
                    <div class="t-content">
                        <div class="t-block hour">
                            <label>12</label>
                            <span>时</span>
                        </div>
                        :
                        <div class="t-block min">
                            <label>12</label>
                            <span>分</span>
                        </div>
                        :
                        <div class="t-block secs">
                            <label>12</label>
                            <span>秒</span>
                        </div>
                    </div>
                </div>
            </div>
            <!--has_countdown-->
            <div class="pad has_countdown">
                <!--活动已结束-->
                <!--<div class="gameOver">-->
                <!--<div class="info">抢红包活动已经结束啦<br/>下次记得赶早哦</div>-->
                <!--<a>去其他地方看看</a>-->
                <!--</div>-->
                <!--活动还没开始-->
                <!--<div class="presell">-->
                    <!--<div class="info">距活动开始还有<span class="num">1</span>天</div>-->
                    <!--<a>去其他地方看看</a>-->
                <!--</div>-->
                <div class="trumpet">
                    <ul>
                        <li>11:11&nbsp;&nbsp;&nbsp;&nbsp;135****0520领取了10元的红包</li>
                        <li>11:11&nbsp;&nbsp;&nbsp;&nbsp;135****0520领取了20元的红包</li>
                        <li>11:11&nbsp;&nbsp;&nbsp;&nbsp;135****0520领取了30元的红包</li>
                        <li>11:11&nbsp;&nbsp;&nbsp;&nbsp;135****0520领取了40元的红包</li>
                        <li>11:11&nbsp;&nbsp;&nbsp;&nbsp;135****0520领取了50元的红包</li>
                    </ul>
                </div>
                <div class="tips">您好,亲爱的XXXX</div>
                <div class="msgBox">
                    <p>您已累计红包:80元&nbsp;&nbsp;可申请提现</p>
                    <p>
                        重要提示:提现后红包将清空<br/>
                        需再次搜集满50元方可提现
                    </p>
                    <p>您已提现红包:80元</p>
                </div>
                <a class="withdraw">还需XX元可申请提现</a>
                <div class="rule">
                    <div class="rule-title">
                        <span class="line"></span>
                        <span class="title">活动规则</span>
                        <span class="line"></span>
                    </div>
                    <div class="rule-content">
                        1、红包每日11:00 15:00 20:00准时开启<br/>
                        2、红包累计大于50元可申请提现<br/>
                        3、活动日期1.27-2.3<br/>
                        4、红包可兑换截至日期为2017年2月10日<br/>
                        5、本活动最终解释权归“简途旅行”所有
                    </div>
                </div>
            </div>
        </div>
        <div class="footer">
            <a href="/">舌尖上的年味</a>
        </div>
    </div>
</div>
<div class="withdraw-modal-wrap">
    <div class="modal-overlay"></div>
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="info">你本次可提现55元,申请提交后,我们将在3个工作日把相应金额转到你的支付宝账户</div>
            <input name="account" type="text" value="" placeholder="请输入你的支付宝账户"/>
        </div>
        <a class="post">提交申请</a>
    </div>
</div>
<script type="text/javascript" src="/old/common/js/zepto.min.js"></script>
<script type="text/javascript" src="/old/common/js/base.js"></script>
<script>
    (function (doc, win) {
        var docEl = doc.documentElement,
                resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
                recalc = function () {
                    var clientWidth = docEl.clientWidth;
                    if (!clientWidth) return;
                    // 针对uc横竖屏rem html没有重绘的问题
                    var style;
                    if (style = document.getElementById("forhtml")) {
                        style.parentNode.removeChild(style);
                    }
                    style = document.createElement("style");
                    style.id = "forhtml";
                    document.head.appendChild(style);
                    style.appendChild(document.createTextNode("html{font-size:" + 20 * (clientWidth / 320) + "px !important;}"));
                };
        recalc();
        document.body.style.visibility = 'visible';
        if (!doc.addEventListener) return;
        win.addEventListener(resizeEvt, recalc, false);
        doc.addEventListener('DOMContentLoaded', recalc, false);
        var a = document.getElementsByTagName('a');
        for (var i = 0; i < a.length; i++) {
            a[i].addEventListener('touchstart', function () {
            }, false);
        }
    })(document, window);
    $(document).ready(function () {
        var img = new Image();
        img.src = 'https://images.simpletour.com/activity/bonus/startupPage.png';
//        img.onload = function(e){
            $('#startup').removeClass('show');
            $('#fetch').addClass('show');
//        }
        //提现弹出框
        var $wrap = $('.withdraw-modal-wrap');
        var $overlay = $wrap.find('.modal-overlay');
        var $dialog = $wrap.find('.modal-dialog');
        $('.withdraw').click(function(e){
            e.preventDefault();
            e.stopPropagation();
            if(!$(this).hasClass('disabled')){
                $wrap.show();
                $overlay.addClass('visible');
                $dialog.show();
            }
        });
        $overlay.click(function(e){
            $wrap.hide();
            $overlay.removeClass('visible');
            $dialog.hide();
        });
        //循环播放
        var $first, $ul = $('.trumpet ul'),$li = $('.trumpet ul li');
        if ($ul.length && $li.length>3) {
            var timer = setInterval(function(){
                if($first){
                    $first.appendTo($ul);
                    $first.removeClass('slideup');
                }
                $first = $('.trumpet ul li:first-child');
                $first.addClass('slideup');
            },2400);
        }
    });
</script>
</body>
</html>